<template>
    <el-dialog width="58%" :title="title" :visible.sync="visible">
        <el-form ref="form" :rules="rules" :model="model"  label-width="160px" size="small" v-loading="loading">
          <el-form-item prop="dictName" label="字典名称">
            <el-input  placeholder="" v-model="model.dictName"></el-input>
          </el-form-item>

          <el-form-item prop="dictCode" label="字典编号">
            <el-input  placeholder="" v-model="model.dictCode"></el-input>
          </el-form-item>

          <el-form-item prop="description" label="说明">
            <el-input type="textarea" placeholder="" v-model="model.description"></el-input>
          </el-form-item>

        </el-form>
        <div  v-if="!disableSubmit"  slot="footer" class="dialog-footer">
          <el-button @click="handleCancel">取 消</el-button>
          <el-button type="primary" @click="handleSubmit">确 定</el-button>
        </div>
      <dict-item-modal></dict-item-modal>
    </el-dialog>
</template>

<script>

  import Vue from 'vue'
  import { ACCESS_TOKEN } from "@/store/mutation-types"
  import ImageUpload from "@/components/ImageUpload"
  import { getAction,deleteAction,putAction,postAction } from '@/api/manage'
  import DictItemModal  from './DictItemModal'


  export default {
    name: "DictModal",
    components: {
      DictItemModal,
      ImageUpload
    },
    data () {
      return {
        title:"操作",
        visible: false,
        loading:false,
        disableSubmit:false,
        isBatch : false,
        model: {},
        url: {

        },  // 新增资产表单验证
        rules: {
          dictName: [{ required: true, message: '请输入字典名称', trigger: 'blur' }],
          dictCode: [{ required: true, message: '请输入字典编码', trigger: 'blur' }]
        },
      }
    },
    created () {
      const token = Vue.ls.get(ACCESS_TOKEN);
      this.headers = {"X-Access-Token":token}
    },
    methods: {
      refresh () {
      },
      add () {
        this.refresh();
        this.edit({});
      },
      edit (record) {
        let that = this;
        this.visible = true;
        this.disableSubmit = false;
        this.isBatch = false;
        if(that.$refs.form){
          that.$refs.form.resetFields();
          that.model = Object.assign({}, record);
        }else{
          this.$nextTick(() => {
            that.$refs.form.resetFields();
            that.model = Object.assign({}, record);
          })
        }
      },
      handleSubmit () {
        const that = this;
        this.$refs.form.validate(valid => {
          if (valid) {
            this.loading = true
            let promise;
            if(!this.model.id){
              promise = postAction("/sys/dict/add",Object.assign({}, this.model))
            }else{
              promise = putAction("/sys/dict/edit",Object.assign({}, this.model))
            }
            promise.then(res =>{
              if(res.success){
                this.$message.success(res.message)
                that.close();
                that.$emit('ok');
              }else{
                this.$message.warning( res.message)
              }
            }).finally(() => {
              this.loading = false
            });
          } else {
            console.log('error submit!!')
            return false
          }
        })
      },
      handleCancel () {
        this.close()
      },
      close () {
        this.$emit('close');
        this.visible = false;
      },
      handleRemove(file) {
        console.log(file);
      }
    }
  }
</script>

<style scoped>

</style>
